<template>
  <div class="demo-title">chexkbox/demo1</div>
  <div class="demo">
    <Checkbox class="checkbox" v-model="checkbox1" @change="changeBox"> Option content1 </Checkbox>
    <Checkbox class="checkbox" v-model="checkbox2"> Option content2 </Checkbox>
  </div>
</template>

<script lang="ts" setup>
  import { ref } from 'vue'
  import Checkbox from '@sscd-mobile/checkbox'
  const checkbox1 = ref(false)
  const checkbox2 = ref(true)
  const changeBox = (state, label) => console.log(`${state},${label}`)
</script>

<style lang="less" scoped>
  .demo {
    display: flex;
    padding: 12px;
    background-color: #fff;
    .checkbox {
      flex: 1;
    }
  }
</style>
